import 'package:flutter/material.dart';
import 'package:flutter_mobx/flutter_mobx.dart';
import 'package:provider/provider.dart';
import 'package:terminal_flutter_demo/pages/mobxpages/store/mobx_counter.dart';

class MobxSecondPage extends StatefulWidget {
  const MobxSecondPage({Key? key}) : super(key: key);

  @override
  _MobxSecondPageState createState() => _MobxSecondPageState();
}

class _MobxSecondPageState extends State<MobxSecondPage> {
  final MobxCounter mobxCounter = MobxCounter();

  @override
  Widget build(BuildContext context) {
    final mobxCounterStore = Provider.of<MobxCounter>(context);

    return Center(
      child: Column(
        children: [
          ElevatedButton.icon(
            icon: const Icon(Icons.add),
            onPressed: () {
              mobxCounter.increnment();
              mobxCounterStore.increnment();
            },
            label: Observer(
              builder: (context) => Row(
                mainAxisAlignment: MainAxisAlignment.spaceAround,
                children: [
                  Text('${mobxCounter.count}'),
                  Text('${mobxCounterStore.count}'),
                ],
              ),
            ),
          ),
          const SizedBox(height: 30),
          ElevatedButton.icon(
            icon: const Icon(Icons.exit_to_app_sharp),
            onPressed: () {
              Navigator.of(context).pop();
            },
            label: const Text('返回'),
          ),
        ],
      ),
    );
  }
}
